<template>
	<uni-popup ref="popup" type="center" :mask-click="false">
		<view class="main">
			<view class="title">
				{{title}}
			</view>
			<view class="content">
				<view class="text" v-for="item in content">
					{{item}}
				</view>
				<!-- <view class="timeTip">
					<view class="time">
						原计划上门时间：{{ opt !== null ? opt.scheduleTime : '' }}
					</view>
					<view class="time">
						修改后上门时间：{{ opt !== null ? opt.updatedScheduleTime : '' }}
					</view>
				</view> -->
				<view class="text">
				</view>
			</view>
			<view class="btns" v-if="btns!==1">
				<view class="btn info" @click="onCancel()">取消</view>
				<view class="btn primary" @click="onOk()">确认</view>
			</view>
			<view class="btns" v-else>
				<view class="btn primary" @click="onOk()">确认</view>
			</view>
		</view>
	</uni-popup>
</template>

<script>
	import uniPopup from '@/components/uni-ui/uni-popup/uni-popup.vue';
	import {
		abandonOrContinueToServe
	} from '@/apis/order/index.js'
	export default {
		props: {
			btns: {
				default: 1,
			},
			content: {
				type: Array,
				default: () => []
			},
			title: {
				default: '温馨提示'
			}
		},
		components: {
			uniPopup
		},
		data() {
			return {
				opt: null,
			}
		},
		mounted() {
			console.log("执行")
			// this.show()
		},
		methods: {
			show(opt) {
				this.$refs.popup.open()
			},
			onOk() {
				this.$emit("onOk")
				this.$refs.popup.close()
			},
			onCancel() {
				this.$emit("onCancel")
				this.$refs.popup.close()
			}
		}
	}
</script>

<style lang="less">
	.main {
		width: 560rpx;
		// height: 582rpx;
		background-image: url('http://loto.oss-cn-shanghai.aliyuncs.com/email/9a5a456f83d94247.png');
		background-size: 100% 100%;
		padding: 44rpx 40rpx 56rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		box-sizing: border-box;

		.title {
			font-weight: 500;
			font-size: 36rpx;
			color: #172941;
			line-height: 50rpx;
			margin-bottom: 40rpx;
		}

		.btns {
			display: flex;
			align-items: center;

			.btn {
				margin: 0 16rpx;
				z-index: 999;
				width: 208rpx;
				height: 72rpx;
				font-size: 28rpx;
				font-family: PingFangSC-Medium, PingFang SC;
				display: flex;
				align-items: center;
				justify-content: center;
				box-sizing: border-box;
				// margin-top: 5%;
				border-radius: 38rpx;
			}
		}


		.content {
			width: 100%;

			.text {
				margin-bottom: 40rpx;
				font-weight: 400;
				font-size: 28rpx;
				color: #1B293F;
				line-height: 40rpx;

			}

			.timeTip {
				margin-bottom: 38rpx;

				.time {
					font-weight: bold;
					font-size: 28rpx;
					color: #EA2027;
					line-height: 40rpx;
				}
			}
		}

		.primary {
			color: #ffffff;
			background: #3c8eff;
		}

		.info {
			// color: rgba(60, 142, 255, 1);
			background: #ffffff;
			border: 2rpx solid #DDDDDD;
		}
	}
</style>